<template>
  <div>
    <!-- <input type="text" v-model="name" > -->
    <input type="text" :value="modelValue" 
    @input="$emit('update:model-value',$event.target.value)"  >
  </div>
</template>

<script setup >
import {defineModel,defineProps,defineEmits} from 'vue';
// let name = defineModel()

defineProps(["model-value"])
defineEmits(["update:model-value"])
</script>

<style scoped>
input{
  height: 30px;
  font-size: 20px;
  background-image: linear-gradient(90deg,#ccc,#fff);
  border: none;
  border-radius: 10px;
  line-height: 30px;
  outline: none;
}
input:focus{
  box-shadow: 0px 0px 2px 2px rgba(0, 255,255,0.3);
}
</style>